<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/bootstrap-table.min.css">
    <script src="js/jquery-3.3.1.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/bootstrap-table.min.js"></script>
    <script src="js/bootstrap-table-zh-CN.min.js"></script>
    <script src="js/jquery.form.js"></script>
    <style>
        h4, h5 {
            text-align: center;
        }

        #img1 {
            height: 200px;
            width: 200px;
        }

        #img2 {
            visibility: hidden;
        }
    </style>
</head>
<body>
<div class="container">
    <div class="row clearfix">
        <div class="col-md-12 column">
            <br>
            <br>
        </div>
    </div>
    <div class="row clearfix">
        <div class="col-md-12 column">
            <div class="row clearfix">
                <div class="col-md-2 column">
                </div>
                <div class="col-md-8 column">
                    <div class="row clearfix">
                        <div class="col-md-12 column" id="homepage">
                            <form id="form1" action="/user/register" method="post">

                            </form>
                        </div>
                    </div>
                    <div class="row clearfix">
                        <div class="col-md-9 column">
                            <div class="row clearfix">
                                <div class="col-md-9 column">
                                    <div class="tabbable" id="tabs-832228">
                                        <ul class="nav nav-tabs">
                                            <li class="active">
                                                <a href="#panel-677471" data-toggle="tab">
                                                    <h5>动态</h5>
                                                    <h4>0</h4>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="#pane" data-toggle="tab" id="a">
                                                    <h5>回答</h5>

                                                </a>
                                            </li>
                                            <li>
                                                <a href="#pan" data-toggle="tab">
                                                    <h5>提问</h5><h4 id="c">0</h4>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="#panel-653017" data-toggle="tab">
                                                    <h5>文章</h5><h4>0</h4>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="#panel-653018" data-toggle="tab">
                                                    <h5>专栏</h5><h4>0</h4>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="#panel-653019" data-toggle="tab">
                                                    <h5>想法</h5><h4>0</h4>
                                                </a>
                                            </li>
                                        </ul>
                                        <div class="tab-content">
                                            <div class="tab-pane active" id="panel-677471">
                                                <p>
                                                    <br>
                                                <h5>我的动态</h5>
                                                </p>
                                                <hr>
                                                关注的话题
                                                <hr>

                                            </div>
                                            <div class="tab-pane" id="pane">
                                                <p>
                                                    <br>
                                                <h5>我的回答</h5>
                                                </p>
                                                <a href="#"><h5>游戏模块</h5></a>
                                                <hr>
                                            </div>
                                            <div class="tab-pane" id="pan">
                                                <p><br>
                                                <h5>我的提问</h5>
                                                </p>
                                                <hr>
                                            </div>
                                            <div class="tab-pane" id="panel-653017">
                                                <p><br>
                                                <h5>我的文章</h5>
                                                </p>
                                                <hr>
                                            </div>
                                            <div class="tab-pane" id="panel-653018">
                                                <p><br>
                                                <h5>我的专栏</h5>
                                                </p>
                                                <hr>
                                            </div>
                                            <div class="tab-pane" id="panel-653019">
                                                <p><br>
                                                <h5>我的想法</h5>
                                                </p>
                                                <hr>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-3 column">
                                    <div class="btn-group">
                                        <button class="btn btn-default">更多</button>
                                        <button data-toggle="dropdown" class="btn btn-default dropdown-toggle"><span
                                                class="caret"></span></button>
                                        <ul class="dropdown-menu">
                                            <li>
                                                <a href="#">收藏</a>
                                            </li>
                                            <li class="disabled">
                                                <a href="#">关注</a>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-3 column">
                            <div class="row clearfix">
                                <div class="col-md-6 column" id="abc">
                                    <h4>关注了</h4>
                                </div>
                                <div class="col-md-6 column" id="abc1">
                                    <h4>关注者</h4>
                                </div>

                                <hr>
                                <h5>关注的话题 </h5>
                                <hr/>
                                <h5>关注的专栏 </h5>
                                <hr/>
                                <h5 id="ab">关注的问题 </h5>
                                <hr/>
                                <h5>关注的收藏夹 </h5>
                                <hr/>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-md-2 column">
                    <button type="button" style="float:right" id="logout">注销</button>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
<script>
    function choose_img() {
        $("input[name='img']").click();
    }

    function upload_img() {
        $("#form1").ajaxSubmit({
            url: "/user/modifyThePicture",
            type: 'post',
            success: function (filePath) {
                $("#img1").prop("src", filePath)
            }
        });
    }

    $(function () {
        $("#logout").click(function () {
            $.ajax({
                url: "/user/loginOutput",
                dataType: "json",
                success: function (result) {
                    if (result) {
                        alert("注销成功！");
                        location.href = "/login.html";
                    } else {
                        alert("注销失败！");
                    }
                }
            })
        })
        $.ajax({
            url: "/attention/userQuiz",
            dataType: "json",
            success: function (rs) {
                $("#c").html(rs.length);
                console.log(rs);
                var list = rs;
                console.log(list[0].title);
                for (var i = 0; i < list.length; i++) {
                    var str = ' <tr>' + '<td>' + list[i].title + '</td>' + '</tr>\n' + '<hr>'
                    $("#pan").append(str)
                }
            }
        })
        $.ajax({
            url: "/user/personal_information",
            dataType: "json",
            success: function (rs) {
                //       console.log(rs);
                var str =
                    '<input hidden  id="img2" type="file" name="img" onchange="upload_img()">' +
                    '<div class="col-md-6 comment_one"><br>' +
                    '<img id="img1" onclick="choose_img()"  name="photo"src=' + rs.msg.handimage + '><br>' +
                    '</div>' +
                    '<div class="col-md-6 comment_one"><br>' +
                    '<span>' +
                    '<h4>' + "手机号: " + rs.msg.phone + '</h4>' +
                    '</span>' +
                    '<br>' +
                    '<span>' +
                    '<h4>' + "用户名: " + rs.msg.username + '</h4>' +
                    '</span>' +
                    '</div>';
                $("#form1").append(str);
                var str1=  '<h4>' + result + '</h4>'
            }
        })
        $.ajax({
            url: "/user_message/attention",
            success: function (result) {
                //   console.log(result);
                var set = '<h4>' + result + '</h4>'
                $("#abc").append(set);
            }
        })
        $.ajax({
            url: "/user_message/be_focused",
            success: function (result) {
                //  console.log(result);
                var set = '<h4>' + result + '</h4>'
                $("#abc1").append(set);
            }
        })
        $.ajax({
            url: "/attention/attentionIssue",
            success: function (result) {
                ///  console.log(result);
                var set = result
                $("#ab").append(set);
            }
        })
        // $.ajax({
        //     url: "/attention/userAnswer",
        //     success: function (result) {
        //         // console.log(result);
        //         var set = '<h5>' + result + '</h5>'
        //         $("#a").append(set);
        //     }
        // })
        $.ajax({
            url: "/attention/userAnswers",
            dataType: "json",
            success: function (answers) {
                //   console.log(answers);
                var list = answers.msg;
                for (var i = 0; i < list.length; i++) {
                    var str = ' <tr>' + '<td>' + list[i].content + '</td>' + '</tr>\n' + '<hr>'
                    $("#pane").append(str)
                }
                var list1 = answers.msg.length;
                var set1 = '<h5>' + list1 + '</h5>'
                $("#a").append(set1);
            }
        })
    });
</script>
</html>